/* Firefox userChrome.css tweaks ********************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/****************************************************************************************/


#main-window .megabar {
  z-index: 3 !important;
}

#main-window #back-button {
  z-index: 4 !important;
  position: relative !important;
}

#main-window #nav-bar #forward-button {
  --toolbarbutton-border-radius: 0px !important;
}

#main-window #navigator-toolbox #nav-bar #nav-bar-customization-target #back-button > .toolbarbutton-icon,
#main-window #nav-bar #back-button > .toolbarbutton-icon {
  width: 100% !important;
  height: 100% !important;
  border-radius: 10000px !important;
  padding: 12px !important; 
  background-color: #f9f9fa !important;
}

#main-window[uidensity=compact] #navigator-toolbox #nav-bar #nav-bar-customization-target #back-button > .toolbarbutton-icon,
#main-window[uidensity=compact] #nav-bar #back-button > .toolbarbutton-icon {
  padding: 10px !important; 
}

#main-window[uidensity=touch] #navigator-toolbox #nav-bar #nav-bar-customization-target #back-button > .toolbarbutton-icon,
#main-window[uidensity=touch] #nav-bar #back-button > .toolbarbutton-icon {
  padding: 14px !important;
}

#main-window #navigator-toolbox #nav-bar #nav-bar-customization-target #forward-button .toolbarbutton-icon,
#main-window #nav-bar #forward-button > .toolbarbutton-icon {
  width: 100% !important;
  /*height: 100% !important;*/
  padding: 8px 8px 8px 14px !important;
}


#main-window[uidensity=compact] #navigator-toolbox #nav-bar #nav-bar-customization-target #forward-button .toolbarbutton-icon,
#main-window[uidensity=compact] #nav-bar #forward-button > .toolbarbutton-icon {
  padding: 6px 6px 6px 12px !important; 
}

#main-window[uidensity=touch] #navigator-toolbox #nav-bar #nav-bar-customization-target #forward-button > .toolbarbutton-icon,
#main-window[uidensity=touch] #nav-bar #forward-button > .toolbarbutton-icon {
  padding: 9px 9px 9px 16px !important; 
}

#main-window #nav-bar #back-button + #forward-button {
 margin-inline-start: -16px !important;
}

#main-window #nav-bar #back-button .toolbarbutton-icon {
  opacity: 1 !important;
}

#main-window #nav-bar #back-button[disabled] .toolbarbutton-icon {
  filter: brightness(90%);
}

/* override classic toolbar buttons code */
#main-window:not([customizing]) #nav-bar #back-button:not(#PlacesChevron)[disabled=true] > .toolbarbutton-icon,
#main-window:not([customizing]) #nav-bar #back-button:not(#PlacesChevron)[disabled=true]:is([open],[checked],:hover:active,:active) > .toolbarbutton-icon {
  background: #efefef !important; /* has to be solid or forward buttons left side will be partly visible */
}

@media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) {

	#main-window #navigator-toolbox #nav-bar #nav-bar-customization-target #back-button > .toolbarbutton-icon,
	#main-window #nav-bar #back-button > .toolbarbutton-icon {
	  background-color: #383740 !important;
	}

	#main-window:not([customizing]) #nav-bar #back-button:not(#PlacesChevron)[disabled=true] > .toolbarbutton-icon,
	#main-window:not([customizing]) #nav-bar #back-button:not(#PlacesChevron)[disabled=true]:is([open],[checked],:hover:active,:active) > .toolbarbutton-icon {
	  background: #383740 !important; /* has to be solid or forward buttons left side will be partly visible */
	}

}
